{layout name="ucenter/layout" /}
<style type="text/css">
  .toolbar {
    border: 1px solid #ccc;
    background: #FFFFFF;
    position:relative;
    top: 50px;
  }
  .text {
    border: 1px solid #ccc;
    height: 700px;
    background: #FFFFFF;
    position:relative;
    top: 50px;
  }
</style>
<div style="height:930px;">
  <form class="layui-form" >
    <div class="layui-form-item">
      <label class="layui-form-label">标题</label>
      <div class="layui-input-inline">
        <input id="title-data" type="text" value="{$articleDetail.title|default=''}" name="title" required  lay-verify="required" placeholder="请输入标题" autocomplete="off" class="layui-input">
      </div>
    </div>
    <div class="layui-form-item" style="position:absolute;z-index:99999;">
      <label class="layui-form-label">分类</label>
      <div class="layui-input-inline">
        <select id="tag-data" name="tag" lay-verify="required">
          <option value=""></option>
          {volist name="tagList" id="vo"}
          <option value="{$vo.id}">{$vo.category_name}</option>
          {/volist}
        </select>
      </div>
    </div>
    <div id="toolbar" class="toolbar">
    </div>
    <div style="padding: 5px 0; color: #ccc"></div>
    <div id="text" class="text"></div>
    <div class="layui-form-item" style= "position:relative; top: 70px;">
      <div class="layui-input-block">
        <button id="btn-submit" class="layui-btn" >立即提交</button>
        <button type="reset" class="layui-btn layui-btn-primary">重置</button>
      </div>
    </div>
  </form>
</div>
<script type="text/javascript" src="https://unpkg.com/wangeditor@3.1.1/release/wangEditor.min.js"></script>
<script>
  layui.use('form');
  //wangEditor富文本编辑器
  var E = window.wangEditor
  var editor1 = new E('#toolbar', '#text') 
  editor1.customConfig.uploadFileName = 'Image'
  editor1.customConfig.uploadImgServer = '/home/ucenter/uploads?path=articleImg'
  // 将图片大小限制为 3M
  editor1.customConfig.uploadImgMaxSize = 3 * 1024 * 1024
  // 限制一次最多上传 9 张图片
  editor1.customConfig.uploadImgMaxLength = 9
  editor1.customConfig.uploadImgHooks = {               
    customInsert: function (insertImg, result, editor1) {        
      var url = result.url
      insertImg(url)      
    }

  }
  editor1.create()
 var detail = "{$articleDetail.title|default=''}";
  if( detail !== ""){
    $("#tag-data").find("option[value='{$articleDetail.category_id|default=""}']").attr("selected",true);
    var ArticleContent ='{$articleDetail.content|default=""|htmlspecialchars_decode}';
   editor1.txt.html(ArticleContent)
 }
  $("#btn-submit").click(function(event){
    event.preventDefault();
    var title = $("#title-data").val();
    var tag = $("#tag-data").val();
    var content = editor1.txt.html();
    var updateArticleId = GetQueryString('id');
    var data = {title:title,tag:tag,content:content,id:updateArticleId};
   $.ajax({
      type:"post",
      url:"/home/ucenter/release",
      data:data,
      success:function(e){
        if(e.code == 1){
          layer.msg(e.msg,{icon: 1});
          editor1.txt.clear();
          $("#title-data").val("");         
        }else if(e.code == 0){
          layer.msg(e.msg,{icon: 1});
        }
      }
    });
  });
  //获取地址栏参数（文章Id）
  function GetQueryString(name) {
    var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
    var r = window.location.search.substr(1).match(reg);
    if(r!=null)return  unescape(r[2]); return null;
  }
</script>